<template>
	<view class="">
		<!-- 打卡记录页面 -->
		<view v-if="!isLoad && postsRecord.length">
			<card :postsRecord="postsRecord" :mid="mid"	:cangodetail="cangodetail" :isshowcomment="isshowcomment"></card>
		</view> 
		<view class="none" v-if="!isLoad && !postsRecord.length">
			还没有发布记录喔~
		</view>
		<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" withCredentials="true" class="add-post" v-if="!phone">
			<image src="/static/images/post/post-add.svg" mode=""></image>
		</button>
		<button  @tap.stop="goPost" hover-class="none" class="add-post" v-else>
			<image src="/static/images/post/post-add.svg" mode=""></image>
		</button>
	</view>
</template>

<script>
	
	import api from '../../../common/api.js'
	import {mapState} from 'vuex'
	import card from '../../../components/common/card.vue'
	
	
	export default {
		
		components: {
			card
		},
		
		computed:mapState(['phone']),
		
		data() {
			return {
				postsRecord: [],
				page:1,						//打卡页数
				limit:15,					//一页条数限制
				mid:null,
				isLoad:1,
				cangodetail:1,		//是否能进入打卡详情页
				isshowcomment:1,	//是否展示评论数据
			}
		},
		updated() {
			var _that = this
			uni.$off('updateHotpostComment')
			uni.$once('updateHotpostComment',(comment_item,index) => {
				console.log('更新下评论好不好');
				// _that.post =  await _that.fetch(_that.page,_that.limit)
				_that.postsRecord[index].commented += 1
				_that.postsRecord[index].hot_comments.unshift(comment_item)
			})
		},
		methods:{
			
			async getPhoneNumber (e) {//手机号授权
			　　if(e.detail.errMsg=="getPhoneNumber:ok"){
			      let res = await api.GetUserPhone(e.detail.encryptedData,e.detail.iv)
						let sres = await api.SetUserPhone(res.purePhoneNumber)
						if(sres.err == 0) {
							this.$store.commit('setPhone',res.purePhoneNumber)
							this.goPost()
							uni.showToast({
								title:sres.msg,
								duration:800
							})
						}
				}else{
			        console.log('用户拒绝了手机号授权') ;   
			    }
			},
			
			async getPostsRecord(page,limit) {//获取我的打卡记录
				return await api.GetPostsRecord(page,limit)
			},
			
			goPost() {//跳转到打卡页面--重置全局变量:curCirid and curCirname
				getApp().globalData.curCirid =''
				getApp().globalData.curCirname = ''
				uni.reLaunch({//reLaunch才会触发跳转页面onload
					url:'/pages/post/index'
				})
			}
		},
		
		async mounted() {
			
		},
		async onShow() {
			this.page = 1
			this.postsRecord =  await this.getPostsRecord(this.page,this.limit)
			this.isLoad = 0
			console.log(this.postsRecord);
		},
		onLoad(p) {
			this.mid = p.mid
		},
		async onReachBottom() {
			let list = await this.getPostsRecord(this.page+1,this.limit)
			if(list && list.length>0){
				this.page++
				this.postsRecord.push(...list)
			}else{
				uni.showToast({ title:'没有更多了', icon: "none" ,duration:800});
			}
			
		},
		async onPullDownRefresh() {//下拉刷新
			this.page = 1
			this.postsRecord = await this.getPostsRecord(this.page ,this.limit)
			setTimeout(() => {
				uni.stopPullDownRefresh()
			},500)
		}
	}
</script>

<style lang="scss">
	.none {
		display: flex;
		height: 100vh;
		justify-content: center;
		align-items: center;
		font-size: 26rpx;
		color: #A7AAB5;
	}
	.add-post {
		width: 90rpx;
		height: 90rpx;
		padding: 0;
		margin: 0;
		background: transparent;
		position: fixed;
		right: 45rpx;
		bottom: 180rpx;
		z-index: 1;
		image {
			width: 100%;
			height: 100%;
		}
	}
</style>
